<template>
	<a-config-provider :locale="locale">
		<div id="app">
			<router-view />
		</div>
	</a-config-provider>
</template>

<script>
import zh_CN from 'ant-design-vue/es/locale/zh_CN'
import en_US from 'ant-design-vue/es/locale/en_US'
import { mapState } from 'vuex'
import themeUtil from '@/utils/themeUtil'
export default {
	name: 'App',
	data() {
		return {}
	},
	computed: {
		...mapState('setting', ['theme', 'lang']),
		locale() {
			return this.lang === 'zh_CN' ? zh_CN : en_US
		}
	},
	watch: {
		'theme.mode': function (val) {
			let closeMessage = this.$message.loading(
				`您选择了主题模式 ${val}, 正在切换...`
			)
			themeUtil.changeThemeColor(this.theme.color, val).then(closeMessage)
		},
		'theme.color': function (val) {
			let closeMessage = this.$message.loading(
				`您选择了主题色 ${val}, 正在切换...`
			)
			themeUtil.changeThemeColor(val, this.theme.mode).then(closeMessage)
		}
	}
}
</script>

<style lang="less"></style>
